<template>
  <view :data-theme="globPrimary">
    <view class="start-warp" :style="[startStyle]">
      <view v-if="show" class="text" :style="[startBtnTop]" @click="home"> 跳过{{ time }} </view>
      <u-image
        :width="windowWidth"
        :height="windowHeight"
        :src="require('@/static/images/start.png')"
      ></u-image>
    </view>
  </view>
</template>
<script>
import tabbarList from '@/settings/tabbarSetting.js'
import { mapState, mapGetters } from 'vuex'
export default {
  data() {
    return {
      tabbarList,
      time: 3,
      show: false,
      timer: null,
    }
  },
  computed: {
    ...mapState({
      globSchoolState: (state) => state.projectSetting.globSchoolState,
    }),
    ...mapGetters({
      globPrimary: 'designSetting/getGlobTheme',
      globPrimaryColor: 'designSetting/getGlobThemeColor',
      globNavbarHeight: 'projectSetting/globNavbarHeight',
      globStatusBarHeight: 'projectSetting/globStatusBarHeight',
      getGlobSchoolSwitch: 'projectSetting/getGlobSchoolSwitch',
    }),
    windowHeight() {
      return this.$u.sys().windowHeight + 'px'
    },
    windowWidth() {
      return this.$u.sys().windowWidth + 'px'
    },
    startStyle() {
      return {
        width: this.windowWidth,
        height: this.windowHeight,
      }
    },
    startBtnTop() {
      return {
        // #ifdef MP
        top: this.globNavbarHeight + this.globStatusBarHeight + 'px',
        // #endif
        // #ifndef MP
        top: this.globStatusBarHeight + 'px',
        // #endif
      }
    },
  },
  onLoad() {
    uni.hideTabBar()
    setTimeout(() => {
      this.show = true
      this.onTime()
    }, 1000)
  },
  methods: {
    home() {
      if (this.getGlobSchoolSwitch == 1 && this.globSchoolState == 1) {
        this.$u.route({
          type: 'redirectTo',
          url: '/pageUser/setting/schoolSearch',
          params: {},
        })
      } else {
        uni.switchTab({
          url: '/pages/index/index',
        })
      }
    },
    onTime() {
      this.timer = setInterval(() => {
        this.time--
        if (this.time < 1) {
          this.home()
          clearInterval(this.timer)
        }
      }, 1000)
    },
  },
}
</script>

<style lang="scss" scoped>
.start-warp {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999;
  background-color: #ffffff;
  .text {
    position: absolute;
    right: 10px;
    color: #303133;
    font-size: 14px;
    z-index: 100;
    padding: 5px 10px;
  }

  .img {
    width: 100%;
    height: 100%;
  }
}
</style>
